import { useEffect, useState, lazy, Suspense } from 'react'
import api from './aips/menu'
import Login from "./pages/login/Login"
import MenuView from "./pages/home/MenuView"
import Navhome from './pages/nav/Navhome'
import Profile from './pages/profile/Profile'
import NotFound from './notfound/NotFound'
const User = lazy(() => import('./pages/system/User'))
const Menu = lazy(() => import('./pages/system/menu'))
const Role = lazy(() => import('./pages/system/Role'))
const Dict = lazy(() => import('./pages/system/Dict'))
const Dept = lazy(() => import('./pages/system/dept/Index'))
import { BrowserRouter, HashRouter, Routes, Route, Navigate } from 'react-router-dom'
function App() {
  // const [menuList, setMenuList] = useState([])
  // const headImg = JSON.parse(localStorage.user).avatar
  // useEffect(() => {
  //   api.menuList(JSON.parse(localStorage.user).username).then(res => {
  //     // setMenuList(filterMenu(res[0].children))
  //     console.log(res);
  //   })
  // }, [])
  return (
    <Suspense fallback={<p>加载中...</p>}>
      <HashRouter>
        <Routes>
          <Route path='/' element={<Navigate to='/menuview' />}></Route>
          <Route path='/login' element={<Login />}></Route>

          <Route path='/profile' element={<MenuView />}>
            <Route index element={<Profile />}></Route>
          </Route>
          <Route path='/home' element={<MenuView />}>
            <Route index element={<Navhome />}></Route>
          </Route>
          <Route path="/system" element={<MenuView />}>
            <Route path='user' element={<User />}></Route>
            <Route path='menu' element={<Menu />}></Route>
            <Route path='role' element={<Role />}></Route>
            <Route path='dict' element={<Dict />}></Route>
            <Route path='dept' element={<Dept />}></Route>
          </Route>
            <Route path='*' element={<NotFound />}></Route>
        </Routes>
      </HashRouter>
    </Suspense>
  )
}

export default App
